<template>
  <div class="home">
    <div class="banner-bd">
      <Banner :src="src1" :href="'/allgoods'"></Banner>
    </div>
    <div class="all-goods">
      <!-- 精品推荐 -->
    <ListHeader :src="recm" title="精品推荐" :did="1"></ListHeader>
    <!-- 精品推荐列表 -->
    <GoodsList :arr="jpList"></GoodsList>
    <!-- 热门兑换 -->
    <ListHeader :src="hot" title="热门兑换" :did="2"></ListHeader>
    <!-- 广告 -->
    <div class="banner-bd">
      <Banner :src="ad"></Banner>
    </div>
    <!-- 热门兑换列表 -->
    <GoodsList :arr="hotList"></GoodsList>
    </div>
    <!-- 积分兑换 -->
    <ListHeader :src="integral" title="积分兑换" :ismore="true"></ListHeader>
    <GongLue></GongLue>
    
  </div>
</template>

<script>
import Banner from "../components/home/banner.vue";
import ListHeader from "../components/home/ListHeader.vue";
import GoodsList from "../components/home/GoodsList.vue";
import GongLue from "../components/home/GongLue.vue";
import src1 from "../assets/images/home/banner.png";
import ad from "../assets/images/home/ad.png";
import recm from "../assets/images/home/Recommend.png";
import hot from "../assets/images/home/hot.png";
import integral from "../assets/images/home/integral.png";

import {Recommend,Hot} from "../http/api"

export default {
  name: "Home",
  components: {
    Banner,ListHeader,GoodsList,GongLue
  },
  data() {
    return {
      src1, ad,recm,hot,integral,
      jpList:[],
      hotList:[],
      isHotSale:0,
      isLatest:0
    }
  },
   created(){
      this.getRecommend();
      this.getHot();
  },
  methods:{
    // 精品推荐
      async getRecommend(){
          const {data}=await Recommend();
          // console.log(data);
          this.jpList=data.data.records
          // this.jpList=data.data.records.map(el=>{
          //   el.coverImg='http://sc.wolfcode.cn'+el.coverImg;
          //   return el;
          // });
      },
      async getHot(){
          const {data}=await Hot();
          // console.log(data);
          this.hotList=data.data.records
          // this.hotList=data.data.records.map(el=>{
          //   el.coverImg='http://sc.wolfcode.cn'+el.coverImg;
          //   return el;
          // });
      }
  },

};
</script>

<style scoped>
.all-goods{
  background-color: #f5f5f5;
  padding-bottom: 30px;
}
.banner-bd{
  padding-bottom: 20px;
}
</style>
